<template>
    <div class="box">
        <header class="header">
          <van-nav-bar
          title="确认订单"
          @click-left="back"
          left-arrow
          ></van-nav-bar>
        </header>
        <div class="content">
          <van-sticky>
            <div class="orderaddress">
              <h1>zzz <h2>18813007814</h2></h1>
              <p>上海宝山区顾村镇水产路701号</p>
            </div>
          </van-sticky>
            <van-card
            v-for="item of orderlist"
            :key="item.proid"
              :num="item.num"
              :price="item.price"
              :title="item.proanme"
              :thumb="item.proimg"
            />
            <van-submit-bar :price="totalprice * 100" button-text="提交订单" @submit="onSubmit" />
        </div>
    </div>
</template>

<script>
import Vue from 'vue'
import { NavBar, Sticky,Card,SubmitBar,Dialog    } from 'vant'
import { Ygetorder } from '@/api'
Vue.use(NavBar)
Vue.use(Sticky)
Vue.use(Card )
Vue.use(SubmitBar)
Vue.use(Dialog)
export default {
  data () {
    return {
      userinfo: {},
      orderlist: [],
      status:0,
      orderid:'',
      totalprice: 0
    }
  },
  methods: {
    back () {
      Dialog.confirm({
      title: '返回',
      message: '确定要返回吗',
    })
      .then(() => {
        this.$router.go(-1)
      })
      .catch(() => {
      })
      },
    onSubmit(){
      console.log('结算页面')
    }
  },
  mounted () {
    const { orderid } = this.$route.params
    Ygetorder({orderid}).then(res => {
      console.log(res.data)
      this.userinfo = res.data.data.userinfo
      this.orderlist =  res.data.data.orderlist
      this.status =  res.data.data.status
      this.orderid =  res.data.data.orderid
      this.totalprice =  res.data.data.totalprice
      console.log(this.orderlist)
    })
  }
  }
</script>
